<template>
	<view class="salary-card" @click="clickCard">
		<view class="head">
			<view>{{title}}</view>
			<text style="font-size: 26rpx;">{{getMoney('期间',salaryInform)}}</text>
			<view class="check-detail" v-if="false">查看详情</view>
		</view >
		<view class="main">
			<view class="reduce-money">应发{{getMoney('应发合计',salaryInform)}}</view>
			<view class="reduce-money">扣款{{getMoney('扣款合计',salaryInform)}}</view>
			<view class="reduce-money">实发{{getMoney('实发合计',salaryInform)}}</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				opt:null,
			}
		},
		props:{
			title:'',
			salaryInform:'',
		},
		methods:{
			clickCard(){
				this.$emit("handleClick")
			},
			getMoney(str,arr){
				//通过名称获取值
				let filterArr = arr.filter(item=>item.label==str)
				if(filterArr.length!=0){
					return filterArr[0].value
				}else{
					return '0'
				}
			},
		},
		created() {
			console.log(this.salaryInform,'121')
			this.opt['应发'] =this.getMoney('应发合计',this.opt)
			this.opt['扣款'] =this.getMoney('扣款合计',this.opt)
			this.opt['实发'] =this.getMoney('实发合计',this.opt)
			console.log(this.opt)
		}
	}
</script>

<style lang="scss" scoped>
	.salary-card{
		padding: 10rpx 32rpx;
		.head{
			display: flex;
			justify-content: space-between;
			font-weight: 600;
			.check-detail{
				font-size: 24rpx;
				color: #007AFF;
				font-weight: 400;
			}
		}
		.main{
			display: flex;
			justify-content: space-between;
		}
	}
	.reduce-money{
		width: calc(100%/3);
		padding: 10rpx 0;
		font-size: 26rpx;
	}
</style>
